<script setup lang="ts">
import {
  SlackOutlined,
  EditOutlined,
  DesktopOutlined,
  CommentOutlined,
  FireOutlined,
  TeamOutlined
} from '@ant-design/icons-vue'
import {deleteUserAccessToken} from "@/api/user/user";
import {delCookie, getCookie} from "@/util/cookieUtil";
import {computed, onBeforeMount, ref} from "vue";
import {userConfigStore} from "@/store/user/userConfigStore";
import {SET_USER_INFO} from "@/store/user/mutationTypes";
import {useAppConfigStore} from "@/store/system/appConfigStore";
import {AppConfig} from "@/types/config";
import {message} from "ant-design-vue";
import {cookieToken} from "@/config/CookieConfig";

const isLogin = ref<boolean>(false)
const showCreateBlog = ref<boolean>(false)
const showCreateQuestion = ref<boolean>(false)
const showUploadBlog = ref<boolean>(false)
const userStore = userConfigStore();

const webConfig = computed(() => useAppConfigStore().getWebConfigData);

onBeforeMount(() => {
  setWebConfigInfo(webConfig.value)
})

// 参数设置
function setWebConfigInfo(webConfigData: AppConfig) {
  showCreateBlog.value = (webConfigData.openCreateBlog === "1")
  showCreateQuestion.value = (webConfigData.openCreateQuestion === "1")
  showUploadBlog.value = (webConfigData.openCreateBlog === "1")
}

function handleCommand(command: any) {
  switch (command) {
    case "logout": {
      userLogout();
    }
      break;
  }
}

function userLogout() {
  deleteUserAccessToken(getCookie(cookieToken))
  delCookie(cookieToken);
  let url = window.parent.location.href;
  let haveToken = url.indexOf("?token");
  if (haveToken !== -1) {
    let list = url.split("?token");
    isLogin.value = false
    window.location.href = list[0];
    let userInfo = {};
    userStore[SET_USER_INFO](userInfo);
  } else {
    window.location.reload();
  }
}

function createBlog() {
  if (!showCreateBlog.value) {
    message.warning("该功能暂未开放，敬请期待！")
    return
  } else {
    message.success("该功能开放，暂未适配完成！")
  }
}

function clickHandle() {
  message.warning("该功能暂未完成适配！")
}
</script>

<template>
  <div class="operation lg:block hidden">
    <a-dropdown-button>
      创作
      <template #overlay>
        <a-menu @click="handleCommand">
          <a-menu-item key="createBlog" :disabled="!showCreateBlog && !webConfig.componentShowMap.showCreateArticle"
                       @click="createBlog">
            <EditOutlined/>
            创作文章
          </a-menu-item>
          <a-menu-item key="uploadBlog" :disabled="!webConfig.componentShowMap.showUploadArticle" @click="clickHandle">
            <DesktopOutlined/>
            上传文章
          </a-menu-item>
          <a-menu-item key="createQuestion" :disabled="!webConfig.componentShowMap.showCreateQuestion" @click="clickHandle">
            <CommentOutlined/>
            发起问答
          </a-menu-item>
          <a-menu-item key="userMoment" :disabled="!webConfig.componentShowMap.showCreateMoment" @click="clickHandle">
            <FireOutlined/>
            发表动态
          </a-menu-item>
          <a-menu-item key="createProblem" :disabled="!webConfig.componentShowMap.showCreateProblem" @click="clickHandle">
            <TeamOutlined/>
            发布面经
          </a-menu-item>
        </a-menu>
      </template>
      <template #icon>
        <SlackOutlined/>
      </template>
    </a-dropdown-button>
  </div>
</template>

<style lang="less" scoped>
:deep(.ant-dropdown-trigger) {
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>
